<script lang="ts" setup name="SecondHalfPrice">
import { CirclePlus, Delete, EditPen, FolderChecked } from '@element-plus/icons-vue'
import { ProTableInstance } from '~/library/components/ProTable/interface'
import { Promotion } from '~/src/api/interface/retail'
import { checkDiscountLimitAPI, deleteDiscountLimitAPI, getDiscountLimitAPI, stopDiscountLimitAPI } from '~/src/api/retail'
import { discountLimitColumn } from './info/columns'
const proTableRef = ref<ProTableInstance>()
const router = useRouter()
const toCreate = (row?: Promotion.DiscountLimit) => {
  if (row) {
    router.push({
      path: '/retail/promotion/secondHalfPriceEdit',
      query: {
        id: row.activityInfoId,
        type: row.checkFlag ? 'audited' : 'edit',
        activity: 'halfPrice',
      },
    })
  } else {
    router.push(`/retail/promotion/secondHalfPriceEdit?type=add&activity=halfPrice`)
  }
}

const onEdit = async (row: Promotion.DiscountLimit, api: (params: any) => Promise<any>, type: string) => {
  await useHandleData(api, { id: row.activityInfoId }, `${type}编号【${row.activityInfoId}】第二件半价活动`)
  proTableRef.value?.getTableList()
}
</script>

<template>
  <div class="auto-height-container">
    <pro-table
      ref="proTableRef"
      :columns="discountLimitColumn"
      highlight-current-row
      :indent="20"
      :init-param="{ activitySubTypeId: 5, activityTypeId: 4 }"
      :isCard="false"
      :pagination="true"
      :request-api="getDiscountLimitAPI"
      row-key="id"
      title="第二件半价活动列表"
    >
      <template #tableHeader>
        <el-button v-auth="'add'" :icon="CirclePlus" type="primary" @click="toCreate()">新增第二件半价活动</el-button>
      </template>
      <template #activityInfoName="{ row }">
        <el-button v-auth="'edit'" :icon="EditPen" link type="primary" @click="toCreate(row)">
          {{ row.activityInfoName }}
        </el-button>
      </template>
      <template #activityBeginDate="{ row }">
        <div v-auth="'edit'" @click="toCreate(row)">
          {{ row.activityBeginDate + '--' + row.activityEndDate || '无' }}
        </div>
      </template>
      <template #operation="scope">
        <el-button
          v-if="!scope.row.checkFlag"
          v-auth="'delete'"
          :icon="Delete"
          link
          type="primary"
          @click="onEdit(scope.row, deleteDiscountLimitAPI, '删除')"
        >
          删除
        </el-button>
        <el-button
          v-if="!scope.row.checkFlag"
          v-auth="'check'"
          :icon="FolderChecked"
          link
          type="primary"
          @click="onEdit(scope.row, checkDiscountLimitAPI, '审核')"
        >
          审核
        </el-button>
        <el-button
          v-if="scope.row.checkFlag && scope.row.status !== 3"
          v-auth="'check'"
          :icon="FolderChecked"
          link
          type="primary"
          @click="onEdit(scope.row, stopDiscountLimitAPI, '停止')"
        >
          停止
        </el-button>
      </template>
    </pro-table>
  </div>
</template>

<style lang="scss" scoped></style>
